import Vue from 'vue'
import VueRouter from 'vue-router'
// import Rank from '../components/rank/Rank.vue'
// import Recommend from '../components/recommend/Recommend.vue'
// import Search from '../components/search/Search.vue'
// import Singer from '../components/singer/Singer.vue'
// import SingerDetail from '../components/singer-detail/SingerDetail.vue'
// import Disc from '../components/disc/Disc.vue'
// import TopList from '../components/top-list/TopList.vue'
// import UserCenter from '../components/user-center/UserCenter'

Vue.use(VueRouter)

const Recommend = (resolve) => {
  import('../components/recommend/Recommend').then((module) => {
    resolve(module)
  })
}
const Singer = (resolve) => {
  import('../components/singer/Singer').then((module) => {
    resolve(module)
  })
}
const Rank = (resolve) => {
  import('../components/rank/Rank').then((module) => {
    resolve(module)
  })
}
const Search = (resolve) => {
  import('../components/search/Search').then((module) => {
    resolve(module)
  })
}
const SingerDetail = (resolve) => {
  import('../components/singer-detail/SingerDetail').then((module) => {
    resolve(module)
  })
}
const Disc = (resolve) => {
  import('../components/disc/Disc').then((module) => {
    resolve(module)
  })
}
const TopList = (resolve) => {
  import('../components/top-list/TopList').then((module) => {
    resolve(module)
  })
}
const UserCenter = (resolve) => {
  import('../components/user-center/UserCenter').then((module) => {
    resolve(module)
  })
}

const routes = [
  {
    path: '/',
    redirect: '/recommend'
  },
  {
    path: '/rank',
    name: 'Rank',
    component: Rank,
    children: [
      {
        path: ':id',
        component: TopList
      }
    ]
  },
  {
    path: '/recommend',
    name: 'Recommend',
    component: Recommend,
    children: [
      {
        path: ':id',
        component: Disc
      }
    ]
  },
  {
    path: '/search',
    name: 'Search',
    component: Search,
    children: [
      {
        path: ':id',
        component: SingerDetail
      }
    ]
  },
  {
    path: '/singer',
    name: 'Singer',
    component: Singer,
    children: [
      {
        path: ':id',
        component: SingerDetail
      }
    ]
  },
  {
    path: '/user',
    name: 'UserCenter',
    component: UserCenter
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router
